import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter_small_project/constants/index.dart';
// import 'package:flutter_small_project/utils/EventBus.dart';
import 'package:flutter_small_project/utils/eventBus.dart';
import 'package:flutter_small_project/utils/toast.dart';

import '../../api/user.dart';
import '../../utils/tokenManager.dart';

class LoginPage extends StatefulWidget {
  const LoginPage({super.key});

  @override
  State<LoginPage> createState() => _LoginPageState();
}

class _LoginPageState extends State<LoginPage> {
  // 定义 timer 计时器
  Timer? _timer;
  int _countDelay = GlobalVariable.TOTALTIME;

  final TextEditingController _phoneController = TextEditingController();
  final TextEditingController _codeController = TextEditingController();


  // 定义正则表达式
  final RegExp _phoneRegExp = RegExp(r'^1[3-9]\d{9}$');
  // 定义验证码校验规则 注意RegExp不支持使用 const 修饰
  //因为在 Dart 中，RegExp 的构造函数不是 const 构造函数，所以你不能用 const 来创建一个 RegExp 实例
  final RegExp _codeRegExp = RegExp(r'^\d{6}$');

  // 发送验证码
  sendCode() async {
    if (_countDelay == GlobalVariable.TOTALTIME) {
      // 对输入框里面的内容进行校验-> 非空 和 正则
      if (_phoneController.text.isEmpty) {
        return PromptAction.showError('手机号不能为空');
      } else if (!_phoneRegExp.hasMatch(_phoneController.text)) {
        return PromptAction.showError('手机号格式不正确');
      }
      setState(() {
        _countDelay--;
      });
      // 发送请求
      final res = await getCodeAPI({'mobile': _phoneController.text});
      // 开启 倒计时
      beginCount();
      // 赋值验证码
      Future.delayed(const Duration(seconds: 2), () {
        _codeController.text = res['code'];
      });
    }
  }

  // 开启倒计时
  beginCount() {
    // 定义 一个定时器
    _timer = Timer.periodic(const Duration(seconds: 1), (timer) {
      if (_countDelay == 0) {
        // 重置计时器
        setState(() {
          _countDelay = GlobalVariable.TOTALTIME;
        });
        // 取消计时器
        _timer?.cancel();
      } else {
        setState(() {
          _countDelay--;
        });
      }
    });
  }

  //登录
  login() async {
    // 首先需要验证手机号和验证码是否为空和符合正则规则
    if (_phoneController.text.isEmpty) {
      return PromptAction.showError('手机号不能为空');
      // 验证码这个地方需要取反进行判断
    } else if (!_phoneRegExp.hasMatch(_phoneController.text)) {
      return PromptAction.showError('手机号格式不正确');
    }

    if (_codeController.text.isEmpty) {
      return PromptAction.showError('验证码不能为空');
    } else if (!_codeRegExp.hasMatch(_codeController.text)) {
      return PromptAction.showError('验证码格式不正确');
    }
    // 获取完毕验证码之后我们需要结束定时器
    _timer?.cancel();
    // 封装请求路径 -> 在 constants ->index.dart 文件中定义
    // 封装请求接口 -> 在 api ->login.dart 文件中定义
    // 发送请求
    final res = await loginAPI({
      'mobile': _phoneController.text,
      'code': _codeController.text,
    });
    //存储token和RefreshToken
    /* 
    [问题]:为什么要存储refreshToken?
    [原因]:
    因为token 的有效期很短,一般只有8小时左右,最长不超过24小时,如果超过时长,token就失效了,此时用户需要重新回到登录页面,重新登录,这样对用户的体验不是很好,所以,为了解决这个问题,我们需要存储refreshToken,refreshToken 的有效期是7天左右,如果refreshToken 失效了,用户才需要重新回到登录页面,重新登录 
    [应用工作机制]
    before: 首先是查看token -> 如果token不存在->删除缓存的token,跳转到登录页面重新登录
    now : token的时效性不变,当token失效之后,不需要跳转到登录页,而是,我们可以拿着refreshToken发送请求获取最新的token和refreshToken → 时机:token失效之后

    
    
    
     */
    tokenManager.setToken(res['token'],refreshToken : res['refreshToken']);
    // 返回上一级页面
    Navigator.pop(context);
    // 一旦登录成功,就发布一个事件,通知我的页面重新获取用户信息,进行重新渲染
    eventBus.fire(LoginEvent());
    
  }

// 显示倒计时
  Widget getTimerShow() {
    if (_countDelay < GlobalVariable.TOTALTIME) {
      return Text(
        '还剩$_countDelay秒',
        style: const TextStyle(color: Colors.green),
      );
    } else {
      return const Text('获取验证码');
    }
  }

// 为了方便测试,直接给手机号进行复制
@override
  void initState() {
    // TODO: implement initState
    super.initState();
    _phoneController.text = '13123456789';
  }

// 页面或者组件被销毁的时候,会调用dispose方法,
  @override
  void dispose() {
    // TODO: implement dispose
    super.dispose();
    // 清除定时器
    _timer?.cancel();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBar(
        title: const Text('登录'),
        backgroundColor: Colors.transparent,
        centerTitle: true,
      ),
      body: Container(
        padding: const EdgeInsets.all(20),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.start,
          children: [
            const Row(
              children: [
                Text(
                  '登录',
                  style: TextStyle(
                    fontSize: 25,
                    fontWeight: FontWeight.bold,
                  ),
                )
              ],
            ),
            const SizedBox(height: 10),
            const Row(
              children: [
                Text(
                  '加入享+, 让生活更轻松',
                  style: TextStyle(fontSize: 15),
                )
              ],
            ),
            const SizedBox(height: 30),
            Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Expanded(
                  child: TextField(
                    controller: _phoneController,
                    decoration: const InputDecoration(
                      labelText: '手机号',
                      hintText: '请输入手机号',
                    ),
                    onChanged: (value) {
                      // _phoneController.text = value;
                      setState(() {});
                    },
                  ),
                ),
                ElevatedButton(
                  style: ElevatedButton.styleFrom(
                    backgroundColor: Colors.white,
                    shadowColor: Colors.transparent,
                    foregroundColor: const Color.fromARGB(255, 85, 145, 175),
                    minimumSize: const Size(100, 50),
                  ),
                  onPressed: () {
                    // 点击获取验证码
                    sendCode();
                  },
                  child: getTimerShow(),
                ),
              ],
            ),
            const SizedBox(height: 8),
            TextField(
              controller: _codeController,
              decoration: const InputDecoration(
                labelText: '验证码',
                hintText: '请输入6位验证码',
              ),
            ),
            const SizedBox(height: 8),
            const Row(
              children: [
                Text(
                  '未注册手机号经验证后将自动登录',
                  style: TextStyle(fontSize: 12, color: Colors.grey),
                ),
              ],
            ),
            const SizedBox(height: 50),
            Row(
              children: [
                Expanded(
                  child: ElevatedButton(
                    style: ElevatedButton.styleFrom(
                      backgroundColor: const Color.fromARGB(255, 85, 145, 175),
                      minimumSize: const Size(100, 50),
                    ),
                    onPressed: () {
                      login();
                    },
                    child: const Text(
                      '登录',
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 20,
                      ),
                    ),
                  ),
                )
              ],
            )
          ],
        ),
      ),
    );
  }
}
